{include file='admin/header.html'}

<div class="layui-container">
    <form class="layui-form">
        <div class="layui-form-item">
            <h2>登录
                <small style="float: right;">
                    <a href="{$site_url}/admin/register.html{if isset($smarty.request.redirect_to)}?redirect_to={$smarty.request.redirect_to|escape:html}{/if}"
                        title="切换注册">切换注册</a>
                </small>
            </h2>
        </div>
        <hr>
        <!-- 表单字段 -->
        <div class="layui-form-item">
            <div class="layui-form-label">用户名</div>
            <div class="layui-input-block">
                <input type="text" name="username" value="anonymous" required lay-verify="required" placeholder="用户名或邮箱"
                    autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-form-label">密码</div>
            <div class="layui-input-block">
                <input type="password" name="password" value="123456" required lay-verify="required" autocomplete="off"
                    placeholder="请输入密码" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-row">
                <div class="layui-col-xs7">
                    <label class="layui-form-label">验证码</label>
                    <div class="layui-input-inline captcha" style="width:75px;">
                        <input type="text" name="captcha" value="" required lay-verify="required" autocomplete="off"
                            placeholder="验证码" class="layui-input">
                    </div>
                </div>
                <div class="layui-col-xs5">
                    <img src="{$site_url}/admin/captcha.html" alt="captcha"
                        onclick="this.src='{$site_url}/admin/captcha.html?rand='+ Math.random()"
                        style="width: 90px;height: 36px;border: 1px solid #eee;cursor: pointer;" />
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <input type="hidden" name="remember" value="0">
                <input type="checkbox" name="remember" value="1" lay-skin="primary" title="记住我" checked>
                <a href="{$site_url}/admin/forget.html{if isset($smarty.request.redirect_to)}?redirect_to={$smarty.request.redirect_to|escape:html}{/if}"
                    title="忘记密码" style="float: right; margin-top: 7px;">忘记密码?</a>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                {if isset($smarty.request.redirect_to)}
                <input type="hidden" name="redirect_to" value="{$smarty.request.redirect_to|escape:html}">
                {/if}
                <button class="layui-btn" lay-submit lay-filter="login">登录</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-form-label"></div>
            <div class="layui-form-mid layui-word-aux">
                <a href="{$site_url}/" title="回到首页"><i class="layui-icon layui-icon-return"></i> 回到首页</a>
            </div>
        </div>
    </form>
</div>

<style>
    body {
        background: #01AAED;
    }

    body .layui-container {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        margin: auto;
        width: 380px;
        height: 420px;
        background: #fff;
        padding: 20px;
        border-radius: 4px;
        box-shadow: 5px 5px 20px #888;
        overflow: hidden;
    }
</style>
<script>
    // JS
    layui.use(['form'], function () {
        var form = layui.form,
            $ = layui.jquery;

        // 监听提交
        form.on("submit(login)", function (data) {
            $.post('{$site_url}/admin/login.html', data.field, function (res) {
                if (res.code) {
                    return layer.alert(res.msg, { icon: 2 });
                }
                if (undefined !== res.token) localStorage.setItem('webToken', res.token);
                layer.alert(res.msg, { icon: 1 });
                setTimeout(function () {
                    var _ta = window.location;
                    if (self.frameElement && self.frameElement.tagName == 'IFRAME') {
                        _ta = parent.window.location;
                    }
                    if ('undefined' !== typeof res.url && res.url) {
                        _ta.href = res.url;
                    } else {
                        _ta.reload();
                    }
                }, 1000);
            }, "json");
            return false;
        });
    });
</script>

{include file='admin/footer.html'}